home *** CD-ROM | disk | FTP | other *** search
/ Personal Computer World 2006 May / PCWMAY06.iso / Software / Freeware / First Page 2006 3.00 / fp2006-final-3.00-setup.exe / {app} / Iscripts / DHTML - Dynamic Content / scrollable-iframe2.izs < prev    next >
Text File  |  2005-09-01  |  4KB  |  116 lines
  1. <!NOWIZARD>
  2.  
  3. <!TITLE>Scrollable IFRAME 
  4. <!/TITLE>
  5.  
  6. <!BROWSER>FF1+ IE5+ Opr7+<!/BROWSER>
  7.  
  8. <!DESCRIPTION>Scrollable iframe renders an IFRAME with scroll up/down functionality of the page within. This is an excellent way to display external content in a contained space.
  9. <!/DESCRIPTION> 
  10.  
  11. <!CATEGORY>dynamic content<!/CATEGORY>
  12.  
  13. <!SCRIPT>
  14. <!-- START OF SCRIPT -->
  15. <!-- Step 1: Add the following code where you wish the scrollable content to appear on your page: -->
  16. <!--Scrollable iframe script- By Dynamic Drive-->
  17. <!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com-->
  18. <!--This credit MUST stay intact for use-->
  19.  
  20. <iframe id="datamain" src="external.htm" width=150 height=150 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=1 scrolling=no></iframe>
  21.  
  22. <layer visibility=hide>
  23. <div style="width:150px;" align="right">
  24. <a href="#" onMouseover="scrollspeed=-2" onMouseout="scrollspeed=0">Up</a> | <a href="#" onMouseover="scrollspeed=2" onMouseout="scrollspeed=0">Down</a>
  25. </div>
  26. </layer>
  27. <!-- Step 2: Ok, here's where you need to pay attention. Insert the below script in the page being loaded in the iframe, at the very end of the document source: -->
  28. <!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->
  29.  
  30. <script language="JavaScript1.2">
  31.  
  32. //Scrollable content III- By http://www.dynamicdrive.com
  33.  
  34. var speed, currentpos=curpos1=0,alt=1,curpos2=-1
  35.  
  36. function initialize(){
  37. if (window.parent.scrollspeed!=0){
  38. speed=window.parent.scrollspeed
  39. scrollwindow()
  40. }
  41. }
  42.  
  43. function scrollwindow(){
  44. temp=(document.all)? document.body.scrollTop : window.pageYOffset
  45. alt=(alt==0)? 1 : 0
  46. if (alt==0)
  47. curpos1=temp
  48. else
  49. curpos2=temp
  50.  
  51. window.scrollBy(0,speed)
  52. }
  53.  
  54. setInterval("initialize()",10)
  55.  
  56. </script>
  57. <!-- Configuring the script
  58. All exterior changes to the script is done in the HTML code of Step 1. Here you can change the iframe's dimensions and page src. You can also decrease the scroll speed by modifying "-2" and "2" in the onMouseover codes to "-1" and "1". For example:
  59.  
  60. onMouseover="scrollspeed=-1" -->
  61. <!-- END OF SCRIPT -->
  62. <!/SCRIPT>
  63.  
  64. <!PREVIEW>
  65. <!-- START OF SCRIPT -->
  66.  
  67. <!-- Step 1: Add the following code where you wish the scrollable content to appear on your page: -->
  68. <!--Scrollable iframe script- By Dynamic Drive-->
  69. <!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com-->
  70. <!--This credit MUST stay intact for use-->
  71.  
  72. <iframe id="datamain" src="external.htm" width=150 height=150 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=1 scrolling=no></iframe>
  73.  
  74. <layer visibility=hide>
  75. <div style="width:150px;" align="right">
  76. <a href="#" onMouseover="scrollspeed=-2" onMouseout="scrollspeed=0">Up</a> | <a href="#" onMouseover="scrollspeed=2" onMouseout="scrollspeed=0">Down</a>
  77. </div>
  78. </layer>
  79. <!-- Step 2: Ok, here's where you need to pay attention. Insert the below script in the page being loaded in the iframe, at the very end of the document source: -->
  80. <!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->
  81.  
  82. <script language="JavaScript1.2">
  83.  
  84. //Scrollable content III- By http://www.dynamicdrive.com
  85.  
  86. var speed, currentpos=curpos1=0,alt=1,curpos2=-1
  87.  
  88. function initialize(){
  89. if (window.parent.scrollspeed!=0){
  90. speed=window.parent.scrollspeed
  91. scrollwindow()
  92. }
  93. }
  94.  
  95. function scrollwindow(){
  96. temp=(document.all)? document.body.scrollTop : window.pageYOffset
  97. alt=(alt==0)? 1 : 0
  98. if (alt==0)
  99. curpos1=temp
  100. else
  101. curpos2=temp
  102.  
  103. window.scrollBy(0,speed)
  104. }
  105.  
  106. setInterval("initialize()",10)
  107.  
  108. </script>
  109. <!-- Configuring the script
  110. All exterior changes to the script is done in the HTML code of Step 1. Here you can change the iframe's dimensions and page src. You can also decrease the scroll speed by modifying "-2" and "2" in the onMouseover codes to "-1" and "1". For example:
  111.  
  112. onMouseover="scrollspeed=-1" -->
  113. <!-- END OF SCRIPT -->
  114. <!/PREVIEW>
  115.  
  116. <!RELATED>NONE<!/RELATED>